import { defineComponent, ref } from "vue";
import "@/styles/trajectory.css"

/**
 * 停留点; 函数式组件
 */
function _holdPoint(props){
  return <div class="hold_point">
    <p>({props.data.serialNumber}){props.data.startTime}</p>
    <p>停留时长 {props.data.time}</p>
  </div>
}

/**
 * 报警; 函数式组件
 */
function _Alarm(props){
  return <div class="alarm">
    <p>(10)报警时间</p>
    <p>报警类型</p>
  </div>
}

export default defineComponent({
  props: {
    type: String,
    data: Object
  },
  setup(props){

    console.log(props);
    /**
     * 根据type返回组件
     */
    function _returnComponent(){
      switch (props.type){
        case "stop":
          return <_holdPoint data={props.data}></_holdPoint>
        case "alarm":
          return <_Alarm data={props.data}></_Alarm>
      }
    }

    return ()=> (_returnComponent())
  }
})
